<template>
  <el-dialog :visible="value" :before-close="cancel" width="50%">
    <template slot="title">
      设置虚拟会员账户
    </template>
    <el-form :model="form" ref="refForm" :rules="rules" label-width="160px">
      <el-form-item label="输入会员账户：" prop="userName">
        <el-input type="text"  v-model="form.userName" :disabled="rowData.editType!=='add'"></el-input>
      </el-form-item>
      <el-form-item label="将上级代理变更为：" prop="proxyId">
        <el-select v-model="form.proxyId" >
          <el-option v-for="item in agencyList"
                     :key="item.id"
                     :label="item.username"
                     :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="充值功能：">
        <span>默认关闭充值功能</span>
      </el-form-item>
      <el-form-item label="提款功能：">
        <span>默认关闭提款功能</span>
      </el-form-item>
      <el-form-item label="转账功能：">
        <el-select v-model="form.platform" multiple  collapse-tags placeholder="请选择需要关闭转账的平台">
          <el-option v-for="item in consts.PLATFORMS_CONFIG"
                     :key="item.value"
                     :label="item.title"
                     :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="参与活动：" >
        <span>默认禁止参与所有活动（包括返水）</span>
      </el-form-item>
      <el-form-item label="备注：" prop="remark" >
        <el-input type="textarea" :rows="4" v-model="form.remark"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="submit('refForm')">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import {form} from '@/build'
  import {
    virtualAgencyQueryApi,
    virtualMemberAddApi,
    virtualMemberEditApi} from '@/services/api/virtual';

  export default {
    name: "virtual-member-dialog",
    props: ['value', 'rowData'],
    mixins: [form],
    data(){
      let platform = (_.isString(this.rowData.unsupportPlatform ) && this.rowData.unsupportPlatform!='') ?(this.rowData.unsupportPlatform).split(','):[];
      return {
        agencyList: [],
        form: {
          userName: this.rowData.username||'',
          proxyId: this.rowData.parentId||'',
          platform: _.map(platform,item=>Number(item)),
          remark: this.rowData.fakeRemark||'',
        },
        rules: {
          userName: [
            {required: true, message: '会员账户名不能为空'}
          ],
          proxyId: [
            {required: true, message: '所属上级代理不能为空'}
          ],
          remark: [
            {required: true, message: '备注不能为空'}
          ],
        },
      }
    },
    computed:{

      formData(){
        const {id,remark}= this.rowData
        return { userId: id,remark}
      }
    },
    methods: {
      cancel() {
        this.$emit('input',false)
      },
      submit(formName) {
        this.$refs[formName].validate((result, fields)=>{
          if (result) {
            if(this.rowData.editType=='add'){
              this.$emit('confirm',{...this.form,userType:'member'});
              this.cancel();
            }else{
              this.$emit('submit',{...this.form,userType:'member'});
              this.cancel();
            }

          } else {
            // console.log('error submit!!');
            return false;
          }
        });

      }
    },
    mounted() {
      this.bindGet(virtualAgencyQueryApi, 'agencyList');
      this.bindSave(virtualMemberAddApi, 'saveForm', 'formData', {
        successMessage:'保存成功',
        afterSuccess: ([result, data]) => {
          if (result) {
            this.$parent.gridSearch();
          }
          return data
        }
      });
      this.getAll()
    }
  }
</script>

<style scoped>

</style>
